<template>
  <div class="monitoring">
    <div class="li">
      <div class="li-img-1"></div>
      <div class="li-info">
        合同管理
      </div>
    </div>
    <div class="li">
      <div class="li-img-2"></div>
      <div class="li-info">
        质量
      </div>
    </div>
    <div class="li">
      <div class="li-img-3"></div>
      <div class="li-info">
        安全
      </div>
    </div>
    <div class="li">
      <div class="li-img-4"></div>
      <div class="li-info">
        进度
      </div>
    </div>
  </div>
</template>

<script>
export default {
  name: 'intelligent-management'
}
</script>

<style rel="stylesheet/scss" lang="scss" scoped>
  .monitoring{
    .li{
      height:2.347rem;
      width: 2.08rem;
      float: left;
      margin-left: 0.12rem;
    }
  }
  .li-info{
    font-size: 0.34rem;
    color: #141418;
    font-family:'苹方';
    text-align: center;
    margin-top: 0.2rem;
  }
  .li-img-1{
    background: url("../../assets/mobile/hetongguanli.png") no-repeat  ;
    background-size:contain;
    width: 1.2rem;
    height: 1.2rem;
    margin-left: auto;
    margin-right: auto;
  }
  .li-img-2{
    background: url("../../assets/mobile/ziliang.png") no-repeat  ;
    background-size:contain;
    width: 1.2rem;
    height: 1.2rem;
    margin-left: auto;
    margin-right: auto;
  }
  .li-img-3{
    background: url("../../assets/mobile/anquan.png") no-repeat  ;
    background-size:contain;
    width: 1.2rem;
    height: 1.2rem;
    margin-left: auto;
    margin-right: auto;
  }
  .li-img-4{
    background: url("../../assets/mobile/jindu.png") no-repeat  ;
    background-size:contain;
    width: 1.2rem;
    height: 1.2rem;
    margin-left: auto;
    margin-right: auto;
  }
</style>
